<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="./img/tx.jpg" type="image/x-icon">
<title>知否</title>
<link type="text/css" href="css/stylea.css" rel="stylesheet" />
<style>
	.box{
		width: 138px;
		height: 39px;
		background-color: #888888;
		line-height: 41px;
		color: #fff;
		margin: 0 auto;
		border-radius: 28px;
		
	}
	.box:hover{
		border-radius: 13px;
		box-shadow: 3px 3px 18px #FFFFFF;
	}
	a{
		text-decoration: none;
	}
	.font{
		font-family: '幼圆';
	}
</style>
</head>
<body>
    <div id='bgr'></div>
<div id='lake'>
  <div id='sploutch'>
    <div class='drop'></div>
    <div id='ripples'>
      <div class='ripple'></div>
      <div class='ripple'></div>
    </div>
    <div id='splashes'>
      <div class='splash'></div>
      <div class='splash'></div>
      <div class='splash'></div>
    </div>
  </div>
</div>
<div id='raftHolder'>
  <div id='raft'>
    <div id='raftTop'></div>
    <div id='raftBottom'></div>
  </div>
</div>
<div id='raftRipples'>
  <div class='raftRipple'></div>
  <div class='raftRipple'></div>
</div>
<div id='raftReflection'>
  <div class='raftReflectionSegment'></div>
  <div class='raftReflectionSegment'></div>
  <div class='raftReflectionSegment'></div>
</div>
<div id='instructions'>
	<!-- <a href="test.html"><div class="box">进入知否</div></a> -->
	<p class="font">一个专注技术教程的订阅站</p>
</div>
<!-- <div id='forest'>
  <div class='tree'></div>
  <div class='tree'></div>
  <div class='tree'></div>
</div> -->


<script>
var HEIGHT,WIDTH;
var lake = document.getElementById("lake");
window.addEventListener('resize', handleResize, false);
handleResize();

function handleResize(){
  HEIGHT = window.innerHeight,
  WIDTH = window.innerWidth;
}

onmousedown = function(event){
  createRipples(event.pageX, event.pageY);
}

function createRipples(x,y){
  var tx = x || Math.random()*WIDTH;
  var ty = y || (Math.random()+.5)*HEIGHT*.5;
  var spltch = document.getElementById("sploutch");
  var cln = spltch.cloneNode(true);
  cln.style.left=(tx-150) +"px";
  
  
   
  cln.style.top=(ty-150) +"px";
  lake.appendChild(cln);
  // remove it from the dom after a while
  setTimeout(function(){
    lake.removeChild(cln);
  }, 4000);
}

setInterval(createRipples, 300);

</script>
<script>
			window.onload = function(){
				let timer = 5;
				setInterval(()=>{
					timer--;
					if(timer==0){
						location.href = 'test.html'
					}
				},500);
			}
</script>

</body>
</html>